import React from 'react';
import './newLading.scss';
import { Upload, Row, Col, Radio, Checkbox, Select, Input, DatePicker, Button, message, Modal, Table } from 'antd';
import AreaData from '../../../component/areaData/areaData.js'; //地址库
import utils from '../../../utils/utils';
import cookie from 'react-cookies';
import BMap from 'BMap';
import moment from 'moment';
import { 
    getAttach
} from '../../../api/extra'



class newLading extends React.Component {
	constructor(props) {
		super(props);
		this.state = {
            makeCargo:'',
            makeCargo_id:''
		}
    }

	componentDidMount(){
		
    }
    
    //上传组件
    getUpLoadUrl = (type, id) => {
        const UpImgUrl = JSON.parse(sessionStorage.getItem('urlConfig')).res_upload_url;
        const _this = this;
        const props = {
            listType: "picture-card",
            className: "avatar-uploader",
            showUploadList: false,
            customRequest(option) {
                console.log(option.file)
                const post_data = {
                    upUrl: UpImgUrl,
                    auth_token: 'abc123',
                    file: option.file,
                    type: '1' //文件类型1
                }
                getAttach(post_data).then(res => {
                    console.log(res);
                    _this.setState({
                        [type]: UpImgUrl + res.data.attach_arr[0].url,
                        [id]: res.data.attach_arr[0].id
                    })
                })
            },
            beforeUpload(file) {
                const isLt20M = file.size / 1024 / 1024 < 20;
                if (!isLt20M) {
                    message.error('Image must smaller than 20MB!');
                }
                return isLt20M;
            },
            onPreview() {
                console.log('')
            }
        }
        return props;
    }
    //上传限制
    beforeUpload(file) {
        const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';
        if (!isJpgOrPng) {
            message.error('You can only upload JPG/PNG file!');
        }
        const isLt2M = file.size / 1024 / 1024 < 2;
        if (!isLt2M) {
            message.error('Image must smaller than 2MB!');
        }
        return isJpgOrPng && isLt2M;
    }

	render(){
        const { makeCargo } = this.state;
		return(
            <div className="deliveryCenter_newLading" id="ContentMainList">
                上传示例
                <Upload {...this.getUpLoadUrl('makeCargo', 'makeCargo_id')} >
                    {makeCargo ? '重新上传' : '点击上传'}
                </Upload>
                <img src={makeCargo} alt="avatar" style={{ width: '100%' }} />
            </div>
		)
	}
}

export default newLading;